<template>
  <!--批量管理-->
  <section class="page batch-manage">
    <data-box @onPageChange="refreshData" :data="sysParamDataSet" :page="pageService">
      <template slot="columns">
        <!--数据列区域-->
        <el-table-column label="操作" :min-width="$helper.getOperateWidth(2)">
          <template slot-scope="scope">
            <el-button type="text" @click="modifyTrigger(scope)">{{scope.row.triggerState==="PAUSED"?"启用":"暂停"}}</el-button>
            <el-button type="text" @click="doBatch(scope)">执行</el-button>
            <el-button type="text" @click="modifyCronClick(scope)">修改</el-button>
          </template>
        </el-table-column>
        <el-table-column prop="taskName" label="任务名称" :min-width="$helper.getColumnWidth(4)">
        </el-table-column>
        <el-table-column prop="taskGroup" label="任务所在组" :min-width="$helper.getColumnWidth(4)" show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="taskDescription" label="任务描述" :min-width="$helper.getColumnWidth(5)">
        </el-table-column>
        <el-table-column prop="nextExecutionTime" label="下次执行时间" :min-width="$helper.getColumnWidth(3)" :formatter="row  => $filter.dateFormat(Number(row.nextExecutionTime))">
        </el-table-column>
        <el-table-column prop="expression" label="表达式" :min-width="$helper.getColumnWidth(3)">
        </el-table-column>
        <el-table-column prop="triggerState" label="状态" :min-width="$helper.getColumnWidth(2)">
        </el-table-column>
      </template>
    </data-box>
    <!-- 修改参数 -->
    <el-dialog title="修改执行时间" width="500px" :visible.sync="dialog.modifyCronDialog" :close-on-click-modal="false" :close-on-press-escape="false" :center="true">
      <modify-cron :modifyData="modifyData" ref="modify-cron" @close="dialog.modifyCronDialog=false" @refreshList="refreshData"></modify-cron>
    </el-dialog>
  </section>
</template>

<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
import { Auth, Layout, Dependencies } from '~/core/decorator';
import DataBox from '~/components/common/data-box.vue';
import { State, Getter } from 'vuex-class';
import { PageService } from '~/utils/page.service';
import { BatchManageService } from '~/services/management-service/batch-manage.service';
import ModifyCron from '~/components/system-manage/batch-manage/modify-cron.vue';


@Auth(14)
@Layout('workspace')
@Component({
  components: {
    DataBox,
    ModifyCron
  },
})
export default class BatchManage extends Vue {
  @Dependencies(BatchManageService)
  private batchManageService: BatchManageService;
  @Dependencies(PageService)
  private pageService: PageService;

  private queryModel: any = {
    triggerGroup : '',
    triggerName: ''
  };
  private sysParamDataSet: any[] = [];
  private dialog: any = {
    modifyCronDialog: false,
  };
  private modifyData: any = {};

  public refreshData() {
    this.batchManageService
      .queryBatchManage(this.pageService)
      .subscribe(
        (data) => {
          this.sysParamDataSet = data;
        }
      );
  }

  private mounted() {
    this.refreshData();
  }

  // 点击修改
  private modifyCronClick(scope){
    this.modifyData = scope.row
    this.dialog.modifyCronDialog = true
  }
  /**
   * 启用触发器
   */
  private modifyTrigger(scope) {
    this.queryModel.triggerGroup = scope.row.taskGroup
    this.queryModel.triggerName = scope.row.taskName
    if(scope.row.triggerState==="PAUSED"){
      this.batchManageService
      .resumeTriggerForJob(this.queryModel)
      .subscribe(
        (data) => {
          this.$message.success('启用成功');
          this.refreshData();
        }
      );
    }else{
      this.batchManageService
      .pauseTriggerForJob(this.queryModel)
      .subscribe(
        (data) => {
          this.$message.success('暂停成功');
          this.refreshData();
        }
      );
    }
    
  }
  /**
   * 执行触发器
   */
  private doBatch(scope) {
    console.log(scope.row,"scope")
    this.queryModel.triggerGroup = scope.row.taskGroup
    this.queryModel.triggerName = scope.row.taskName
    this.batchManageService
      .doBatchManage(this.queryModel)
      .subscribe(
        (data) => {
          this.$message.success('执行成功');
        }
      );
  }
}
</script>

<style lang="less">
</style>
